import React, { Component } from 'react';
import { getSearch } from '../utils/utils';
import qs from 'qs';
import autoBind from 'react-autobind';
import { connect } from 'dva';

// widget 
import ShopNav from '../components/Shop/ShopNav'
import ShopBody from '../components/Shop/ShopBody'

class ShopPage extends Component {
	constructor(props) {
        super(props)
        autoBind(this)

        this.state = {
            keywords: null
        }

    }
    componentDidMount() {
    	const { dispatch, params, location } = this.props
        const search = getSearch(location)

    	dispatch({
    		type: 'goods/getBrandDetail',
    		payload: {
    			brandId: params && params.shopId,
                keywords: search.keywords || ''
    		}
    	})
    }
    resetKeywords() {
        this.setState({
            keywords: null
        })
    }
    onSearch(keywords) {
        const { dispatch, params } = this.props

        this.setState({
            keywords
        })
        dispatch({
            type: 'goods/getBrandDetail',
            payload: {
                brandId: params && params.shopId,
                keywords
            }
        })
    }
	render() {
        
		return (
		  	<div>
		    	<ShopNav 
                    onSearch={this.onSearch}
                    {...this.props} />
		    	<ShopBody 
                    resetKeywords={this.resetKeywords}
                    keywords={this.state.keywords} 
                    {...this.props} />
		    </div>
		);
	}
}
ShopPage.propTypes = {
};



export default connect(({ meyley, goods }) => ({
	meyley,
    goods
}))(ShopPage);